.login-mask {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 1003;
  overflow: hidden;
  display: none;
  font-family: "VarelaRound-Regular", "PingFangSC-Light", "Microsoft YaHei";
}

.login-mask * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.login-mask .login-box {
  width: 78.667vw;
  margin: 35% auto;
  overflow: hidden;
  background-color: white;
  border-radius: 3.2vw;
  position: relative;
  padding: 0;
  content: 'viewport-units-buggyfill; width: 78.667vw; border-radius: 3.2vw';
}

.login-mask form {
  margin: 8.533vw auto;
  content: 'viewport-units-buggyfill; margin: 8.533vw auto';
}

.login-mask input {
  margin: 2.133vw auto 0 auto;
  display: block;
  width: 68vw;
  height: 12.267vw;
  line-height: normal;
  font-size: 3.733vw;
  font-family: VarelaRound-Regular;
  text-indent: 5.333vw;
  outline: none;
  color: #4b5058;
  background: white;
  border-radius: 6.133vw;
  border: 0.267vw solid #f2f2f2;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
          content: 'viewport-units-buggyfill; margin: 2.133vw auto 0 auto; width: 68vw; height: 12.267vw; font-size: 3.733vw; text-indent: 5.333vw; border-radius: 6.133vw; border: 0.267vw solid #f2f2f2';
}

.login-mask input::-webkit-input-placeholder {
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #c1c1c1;
}

.login-mask input:-ms-input-placeholder {
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #c1c1c1;
}

.login-mask input::-ms-input-placeholder {
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #c1c1c1;
}

.login-mask input::placeholder {
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #c1c1c1;
}

.login-mask .login-title {
  height: 7.467vw;
  margin-bottom: 6.4vw;
  line-height: 7.467vw;
  font-size: 5.333vw;
  font-family: PingFangSC-Medium;
  color: #4b5058;
  text-align: center;
  content: 'viewport-units-buggyfill; height: 7.467vw; margin-bottom: 6.4vw; line-height: 7.467vw; font-size: 5.333vw';
}

.login-mask .submit-btn {
  display: block;
  margin: 2.133vw auto 0 auto;
  width: 68vw;
  height: 12.8vw;
  line-height: 12.8vw;
  background: rgba(153, 159, 168, 0.6);
  border-radius: 6.4vw;
  font-size: 4.267vw;
  font-family: PingFangSC-Medium;
  color: #e5e6e9;
  text-align: center;
  content: 'viewport-units-buggyfill; margin: 2.133vw auto 0 auto; width: 68vw; height: 12.8vw; line-height: 12.8vw; border-radius: 6.4vw; font-size: 4.267vw';
}

.login-mask .active {
  background: #32cdff;
  color: white;
}

.login-mask .send-btn {
  display: inline-block;
  width: 24vw;
  height: 12.8vw;
  line-height: 12.8vw;
  font-size: 3.733vw;
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #4b5058;
  position: absolute;
  top: 36.8vw;
  right: 5.067vw;
  content: 'viewport-units-buggyfill; width: 24vw; height: 12.8vw; line-height: 12.8vw; font-size: 3.733vw; top: 36.8vw; right: 5.067vw';
}

.login-mask .underline {
  text-decoration: underline;
}

.login-mask #forgetPassword {
  margin: 4.267vw 10.933vw 0 17.067vw;
  display: inline-block;
  width: 18.667vw;
  height: 5.333vw;
  line-height: 5.333vw;
  font-size: 3.733vw;
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #999fa8;
  content: 'viewport-units-buggyfill; margin: 4.267vw 10.933vw 0 17.067vw; width: 18.667vw; height: 5.333vw; line-height: 5.333vw; font-size: 3.733vw';
}

.login-mask #switchRegister {
  display: inline-block;
  width: 18.667vw;
  height: 5.333vw;
  line-height: 5.333vw;
  font-size: 3.733vw;
  font-weight: 300;
  font-family: PingFangSC-Light;
  color: #4b5058;
  content: 'viewport-units-buggyfill; width: 18.667vw; height: 5.333vw; line-height: 5.333vw; font-size: 3.733vw';
}

.login-mask #backLogin {
  position: absolute;
  top: 9.333vw;
  left: 6.667vw;
  width: 6.4vw;
  height: 6.4vw;
  background: url("");
  background-size: 6.4vw 6.4vw;
  content: 'viewport-units-buggyfill; top: 9.333vw; left: 6.667vw; width: 6.4vw; height: 6.4vw; background-size: 6.4vw 6.4vw';
}

.login-mask #switchLogin {
  margin: 4.267vw auto 0 auto;
  text-align: center;
  height: 5.333vw;
  font-size: 3.733vw;
  font-family: PingFangSC-Regular;
  color: #4b5058;
  content: 'viewport-units-buggyfill; margin: 4.267vw auto 0 auto; height: 5.333vw; font-size: 3.733vw';
}

.login-mask #showHideRegPassword, .login-mask #showHideResetPassword {
  position: absolute;
  display: block;
  top: 51.2vw;
  right: 5.333vw;
  width: 13.6vw;
  height: 12.267vw;
  background-size: 4.267vw 4.267vw;
  background-repeat: no-repeat;
  background-position: 4vw 4vw;
  content: 'viewport-units-buggyfill; top: 51.2vw; right: 5.333vw; width: 13.6vw; height: 12.267vw; background-size: 4.267vw 4.267vw; background-position: 4vw 4vw';
}

.login-mask #showHideRegPassword.show, .login-mask #showHideResetPassword.show {
  background-image: url("");
}

.login-mask #showHideRegPassword.hide, .login-mask #showHideResetPassword.hide {
  background-image: url("");
}
